//
//  SwiftUIView_ScrollView.swift
//  SwiftUIPractice
//
//  Created by 已经是下午四点时时三分了 (external - Project) on 2024/9/9.
//

import SwiftUI

struct SwiftUIView_ScrollView: View {
    var body: some View {

        //先来一个反面教材 ,, 这个东西就已经上下超出屏幕了, 这里就需要使用到滚动视图了
//        VStack {
//            Rectangle().fill(Color.black).frame(height: 300)
//            Rectangle().fill(Color.black).frame(height: 300)
//            Rectangle().fill(Color.black).frame(height: 300)
//        }
        
        //要做的事情很简单, 就是把这个东西嵌套在 滚动视图里面
//        ScrollView (.vertical, showsIndicators: true) {
//            VStack {
//                ForEach(0..<10) { index in
//                    Rectangle().fill(Color.blue).frame(height: 300)
//                }
//            }
//        }
        
        
//        //开始下一个示例
//        ScrollView(.vertical, showsIndicators: true) {  //在写这个东西的时候, 最好指明方向
//            
//            VStack {
//                
//                ForEach(0..<10) { i in
//                    
//                    ScrollView(.horizontal, showsIndicators: true) {  //在写这个东西的时候, 最好指明方向
//                        
//                        HStack {
//                            
//                            ForEach(0..<10) { j in
//                                RoundedRectangle(cornerRadius: 25).fill(.white).frame(width: 200, height: 150).shadow(radius: 10).padding()
//                            }
//                        }
//                    }
//                }
//            }
//        }
//

        
        
        //开始下一个示例
        ScrollView(.vertical, showsIndicators: true) {
            
            //当我们有大量的格子需要创建的时候, 通常 VStack 会把所有内容都创建出来,这样,就会出现同时下载100张图片的奇观,
            //为了避免这样的事情发生, 那么就是用  LazyVStack  LazyHStack  这样的话, 里面的内容就会按需创建
            LazyVStack {
                ForEach(0..<100) { i in
                    ScrollView(.horizontal, showsIndicators: true) {
                        LazyHStack {
                            ForEach(0..<100) { j in
                                 RoundedRectangle(cornerRadius: 25).fill(.white).frame(width: 200, height: 150).shadow(radius: 10).padding()
                            }
                        }
                    }
                }
            }
        }
        
        
        
    }
}

#Preview {
    SwiftUIView_ScrollView()
}
